<template>
	<div>
		<h2 style="margin-bottom: 10px">不确定度理论法（汽车与二轮摩托车或自行车质心侧面碰撞）</h2>
		<div class="title-content">
			<el-form-item label="汽车质量 (m2)" prop="m2">
				<el-input class="ipt" v-model="form.m2" />
			</el-form-item>
			<el-form-item label="二轮摩托车或自行车质量 (m1)" prop="m1">
				<el-input class="ipt" v-model="form.m1" />
			</el-form-item>
			<el-form-item label="骑车人质量 (mp)" prop="mp">
				<el-input class="ipt" v-model="form.mp" />
			</el-form-item>
		</div>
		<h4 style="margin-bottom: 10px">不确定输入参数范围</h4>
		<div class="title">
			<div>上界</div>
			<div>下界</div>
		</div>
		<el-form
			:model="form"
			:rules="rules"
			ref="formRef"
			label-width="300px"
			label-position="left"
			:inline="true"
		>
			<el-form-item label="被抛出的角度 (o1Degrees)" prop="o1Degrees">
				<el-form-item prop="o1Degrees">
					<el-input class="ipt" v-model="form.o1Degrees" />
				</el-form-item>
				<el-form-item prop="o1Degrees11">
					<el-input class="ipt" v-model="form.o1Degrees11" />
				</el-form-item>
			</el-form-item>

			<el-form-item label="车体与路面摩擦系数 (co1)" prop="co1">
				<el-form-item prop="co1">
					<el-input class="ipt" v-model="form.co1" />
				</el-form-item>
				<el-form-item prop="co2">
					<el-input class="ipt" v-model="form.co2" />
				</el-form-item>
			</el-form-item>
			<el-form-item label="碰撞后的滑移距离 (cs1)" prop="cs1">
				<el-form-item prop="cs1">
					<el-input class="ipt" v-model="form.cs1" />
				</el-form-item>
				<el-form-item prop="cs2">
					<el-input class="ipt" v-model="form.cs2" />
				</el-form-item>
			</el-form-item>

			<el-form-item label="骑车人与地面的摩擦系数 (op)" prop="op">
				<el-form-item prop="op">
					<el-input class="ipt" v-model="form.op" />
				</el-form-item>
				<el-form-item prop="op1">
					<el-input class="ipt" v-model="form.op1" />
				</el-form-item>
			</el-form-item>
			<el-form-item label="骑车人被抛出的角度 (opDegrees)" prop="opDegrees">
				<el-form-item prop="opDegrees">
					<el-input class="ipt" v-model="form.opDegrees" />
				</el-form-item>
				<el-form-item prop="opDegrees1">
					<el-input class="ipt" v-model="form.opDegrees1" />
				</el-form-item>
			</el-form-item>
			<el-form-item label="碰撞时骑车人的质心高度 (h)" prop="h">
				<el-form-item prop="h">
					<el-input class="ipt" v-model="form.h" />
				</el-form-item>
				<el-form-item prop="h1">
					<el-input class="ipt" v-model="form.h1" />
				</el-form-item>
			</el-form-item>
			<el-form-item label="碰撞后的滑移距离 (sp)" prop="sp">
				<el-form-item prop="sp">
					<el-input class="ipt" v-model="form.sp" />
				</el-form-item>
				<el-form-item prop="sp1">
					<el-input class="ipt" v-model="form.sp1" />
				</el-form-item>
			</el-form-item>

			<el-form-item label="汽车的滑动附着系数 (qo)" prop="qo">
				<el-form-item prop="qo">
					<el-input class="ipt" v-model="form.qo" />
				</el-form-item>
				<el-form-item prop="qo1">
					<el-input class="ipt" v-model="form.qo1" />
				</el-form-item>
			</el-form-item>
			<el-form-item label="碰撞后的滑移距离 (qs)" prop="qs">
				<el-form-item prop="qs">
					<el-input class="ipt" v-model="form.qs" />
				</el-form-item>
				<el-form-item prop="qs1">
					<el-input class="ipt" v-model="form.qs1" />
				</el-form-item>
			</el-form-item>
		</el-form>
		<h4 style="margin-bottom: 10px">输出结果</h4>
		<div class="footer">
			<div>
				<el-form-item label="速度下界 (km/h)">
					<el-input class="ipt" v-model="result" type="number" />
				</el-form-item>
				<el-form-item label="速度上界 (km/h)">
					<el-input class="ipt" v-model="result1" type="number" />
				</el-form-item>
			</div>
			<div style="margin-left: 220px">
				<el-button type="primary" @click="calculateSpeed">不确定分析</el-button>
			</div>
		</div>
	</div>
</template>

<script lang="ts" setup>
import { ref } from "vue";
const formRef = ref(null);
const form = ref({
	m1: null,
	o1Degrees: null,
	g: 9.8,
	co1: null,
	cs1: null,
	mp: null,
	op: null,
	opDegrees: null,
	h: null,
	sp: null,
	m2: null,
	qo: null,
	k2: 1,
	qs: null
});

const result = ref(null);

const rules = {
	m1: [{ required: true, message: "请输入 m1", trigger: "blur" }],
	o1Degrees: [{ required: true, message: "请输入 o1Degrees", trigger: "blur" }],
	g: [{ required: true, message: "请输入 g", trigger: "blur" }],
	co1: [{ required: true, message: "请输入 co1", trigger: "blur" }],
	cs1: [{ required: true, message: "请输入 cs1", trigger: "blur" }],
	mp: [{ required: true, message: "请输入 mp", trigger: "blur" }],
	op: [{ required: true, message: "请输入 op", trigger: "blur" }],
	opDegrees: [{ required: true, message: "请输入 opDegrees", trigger: "blur" }],
	h: [{ required: true, message: "请输入 h", trigger: "blur" }],
	sp: [{ required: true, message: "请输入 sp", trigger: "blur" }],
	m2: [{ required: true, message: "请输入 m2", trigger: "blur" }],
	qo: [{ required: true, message: "请输入 qo", trigger: "blur" }],
	k2: [{ required: true, message: "请输入 k2", trigger: "blur" }],
	qs: [{ required: true, message: "请输入 qs", trigger: "blur" }]
};

const calculateSpeed = () => {
	formRef.value.validate((valid) => {
		if (valid) {
			const { m1, o1Degrees, g, co1, cs1, mp, op, opDegrees, h, sp, m2, qo, k2, qs } =
				form.value;

			const toRadians = (degrees) => degrees * (Math.PI / 180);
			const o1Radians = toRadians(o1Degrees);
			const opRadians = toRadians(opDegrees);

			const numerator1 = m1 * Math.sin(o1Radians) * Math.sqrt(2 * g * co1 * cs1);
			const numerator2 =
				mp *
				Math.sqrt(2 * g) *
				op *
				Math.sin(opRadians) *
				(Math.sqrt(h + sp / op) - Math.sqrt(h));
			const numerator3 = m2 * Math.sqrt(2 * g * qo * k2 * qs);

			const V = ((numerator1 + numerator2 + numerator3) * 3.6) / m2;

			result.value = V;
		}
	});
};
</script>

<style scoped>
.ipt {
	width: 120px;
}
.title {
	display: flex;
	align-items: center;
	padding-left: 337px;
	margin-bottom: 20px;
	div {
		margin-right: 131px;
	}
}
.footer {
	display: flex;
	align-items: center;
}
.title-content {
	display: flex;
	align-items: center;
}
</style>
